*, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; }
.clearfix:before, .clearfix:after { content: ''; display: table; }
.clearfix:after { clear: both; }



body {
	background: #fff;
	color: #74777b;
	font-weight: 500;
	font-size: 1.3em;
	font-family: 'Raleway', Arial, sans-serif;
}

a {
	color: #2fa0ec;
	text-decoration: none;
	outline: none;
}


.dummytip-avatar a h4 {
	font-size: 1.5em;
	font-weight: 400;
}

.tooltippp {
	position: relative;
}

.tooltippp-content {
	position: absolute;
	pointer-events: none;
	text-align: center;
	z-index: 100;
	opacity: 0;
	padding: 2em;
	/*文字大小*/
	font-size: 0.9em;
	bottom: 100%;
	color:black;
}


.tooltippp-effect-2 .tooltippp-content {
	width: 120px;
	left: 54%;
	/*文字位置  上 右 下 左 */
	margin: 0px 0 -40px -20px;
	-webkit-transform: translate3d(0,-10px,0);
	transform: translate3d(0,-10px,0);
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}


.tooltippp-effect-2:hover .tooltippp-content {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}



.tooltippp-shape {
	position: absolute;
	width: 70px;
	height: 55px;
	pointer-events: none;
}

.tooltippp-effect-2 .tooltippp-shape {
	bottom: 100%;
	left: 60%;
	/* 轮廓位置 上 右 下 左 */
	margin: 0px 0px -40px -5px;
}

.tooltippp:hover .tooltippp-shape {
	pointer-events: auto;
}

.tooltippp-shape svg {
	stroke: #e74c3c;
	stroke-width: 2;
}


.tooltippp-effect-2 .tooltippp-shape svg polygon {
	fill: transparent;
	stroke-dasharray: 580;
	stroke-dashoffset: 580;
}

.tooltippp-effect-2:hover .tooltippp-shape svg polygon {
	stroke-dashoffset: 0;
	fill: #fff;
	-webkit-transition: stroke-dashoffset 0.8s, fill 0.8s;
	transition: stroke-dashoffset 0.8s, fill 0.8s;
}

